Skip to main content

How to setup and check Lazy Loading performance?

Hello there, dear user! I'm thrilled to guide you through the process of setting up and checking the Lazy Loading feature on your website. But first, let's understand what Lazy Loading is.

Introduction

Lazy Loading is a fantastic technology that can significantly improve your website's loading speed and enhance the user experience at your online store. Instead of loading the entire webpage and displaying it to the user all at once, Lazy Loading loads only the necessary parts and delays the rest until the user needs them.

In this guide, I'll walk you through how to set up and check if Lazy Loading is working efficiently on your store. So, let's get started!

Step 1: Enabling Lazy Loading

First, please navigate to the 'App' section, then 'Speed Up', and finally 'Lazy Loading'.

Lazy Loading Setup

To enable the function, all you need to do is toggle the button. Easy, right?

Step 2: Checking Lazy Loading Performance

Next, let's check how well Lazy Loading is working. Please access your Home page, Product page, and Collection page.

Right-click on each page and then click on 'Inspect'. If you see the code line including img_loading="lazy" as shown in the image below, congratulations! Lazy Loading is working smoothly on your site.

Lazy Loading Check

Please note that the code line's placement may vary depending on the theme you're using. For example:

Lazy Loading Example

In case you can't find the code line, don't worry! Simply press Ctrl + F and enter the keyword as shown in the following image.

Lazy Loading Search

And there you have it! You've successfully set up and checked Lazy Loading on your website. If you have any more questions or need further assistance, please don't hesitate to ask. Happy optimizing!